<script setup lang='ts'>
import { ref, reactive,onMounted } from 'vue'
import { GetBarWheelMachineWorkAll } from '@/api/publicApi'
defineProps({
  num: {
    type: Number,
    default: 0
  }
})
// const type = ref(0)
// 表格
const tableData:any = ref([])

const cellStyle = {
  textAlign: 'center'
}

const headStyle = {
  textAlign: 'center'
}

// 分页
const pageInfo = reactive({
  total: 100,
  pageSize: 10,
  pageNum: 1
})

// 定义函数
onMounted(() => {
  getStockHistoryList()
})

// 获取堆料任务历史
const getStockHistoryList = (startTime?:string,endTime?:string) => {
  const params = {
    BarWheelMachineCode: localStorage.getItem('BarWheelMachineCode'),
    SkipCount: (pageInfo.pageNum - 1) * pageInfo.pageSize,
    MaxResultCount: pageInfo.pageSize,
    StartTime: startTime,
    EndTime: endTime
  }
  tableData.value = []
  GetBarWheelMachineWorkAll(params).then(res => {
    tableData.value = [ ...res.result.items ]
    pageInfo.total = res.result.totalCount
    // this.tableData.forEach()
  })
}
// 改变每页数量
const handlePlanSizeChange = (val: number) => {
  pageInfo.pageSize = val
  getStockHistoryList()
}
// 切换页码
const handlePlanCurrentChange = (val: number) => {
  pageInfo.pageNum = val
  getStockHistoryList()
}

// 向外暴露的函数与变量
defineExpose({
  getStockHistoryList
})
</script>

<template>
  <el-table
    :cell-style="cellStyle"
    :header-cell-style="headStyle"
    :data="tableData"
    max-height="240"
    size="small"
  >
    <el-table-column
      prop="beltStackStartTime"
      label="开始时间"
    >
      <template #default="scope">
        {{ (scope.row.beltStackStartTime.split('T')[0] + " " + scope.row.beltStackStartTime.split('T')[1]).split('.')[0] }}
      </template> 
    </el-table-column>
    <el-table-column
      prop="beltStackEndTime"
      label="结束时间"
    >
      <template #default="scope">
        {{ (scope.row.beltStackEndTime.split('T')[0] + " " + scope.row.beltStackEndTime.split('T')[1]).split('.')[0] }}
      </template>
    </el-table-column>
    <el-table-column
      v-if="num"
      prop="stockWeight"
      label="堆料量(吨)"
    />
    <el-table-column
      v-else
      prop="takeWeight"
      label="取料量(吨)"
    />
    <el-table-column
      v-if="num"
      prop="beltStackCarStrokeStartPosition"
      label="开始位置(米)"
    >
      <template #default="scope">
        {{ scope.row.beltStackCarStrokeStartPosition.toString().match(/^\d+(?:\.\d{0,2})?/)[0] }}
      </template>
    </el-table-column>
    <el-table-column
      v-else
      prop="beltTakeCarStrokeStartPosition"
      label="开始位置(米)"
    >
      <template #default="scope">
        {{ scope.row.beltTakeCarStrokeStartPosition.toString().match(/^\d+(?:\.\d{0,2})?/)[0] }}
      </template>
    </el-table-column>
    <el-table-column
      v-if="num"
      prop="beltStackCarStrokeEndPosition"
      label="结束位置(米)"
    >
      <template #default="scope">
        {{ scope.row.beltStackCarStrokeEndPosition.toString().match(/^\d+(?:\.\d{0,2})?/)[0] }}
      </template>
    </el-table-column>
    <el-table-column
      v-else
      prop="beltTakeCarStrokeEndPosition"
      label="结束位置(米)"
    >
      <template #default="scope">
        {{ scope.row.beltTakeCarStrokeEndPosition.toString().match(/^\d+(?:\.\d{0,2})?/)[0] }}
      </template>
    </el-table-column>
  </el-table>
  <div class="pagination-box">
    <el-pagination
      v-model:current-page="pageInfo.pageNum"
      v-model:page-size="pageInfo.pageSize"
      :page-sizes="[5, 10, 15, 20]"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageInfo.total"
      @size-change="handlePlanSizeChange"
      @current-change="handlePlanCurrentChange"
    />
  </div>
</template>

<style scoped lang=scss>
.pagination-box {
  margin-top: 10px;
}
</style>